<template>
  <div id="app">
    <router-view />
  </div>
</template>

<script>
export default {
  name: "App"
};
</script>

<style lang="less">
html,
body {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: 0px;
  margin: 0px;
  background-color: #f3f3f3;
}

#app {
  font-family: "Avenir", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #2c3e50;
  widows: 100%;
  height: 100%;
}

.el-main {
  padding: 15px 0;
}
* {
  scrollbar-color: rgba(144, 147, 153, 0.3) transparent; /* 滑块颜色  滚动条背景颜色 */
  scrollbar-width: thin; /* 滚动条宽度有三种：thin、auto、none */
  // 滚动条整体部分
}
*::-webkit-scrollbar {
  width: 2px;
  height: 2px;
}
// 滚动条的轨道的两端按钮，允许通过点击微调小方块的位置。
*::-webkit-scrollbar-button {
  display: none;
}
// 滚动条的轨道（里面装有Thumb）
*::-webkit-scrollbar-track {
  background: transparent;
}
// 滚动条的轨道（里面装有Thumb）
*::-webkit-scrollbar-track-piece {
  background-color: transparent;
}
// 滚动条里面的小方块，能向上向下移动（或往左往右移动，取决于是垂直滚动条还是水平滚动条）
*::-webkit-scrollbar-thumb {
  background: rgba(117, 147, 230, 0.3);
  cursor: pointer;
  border-radius: 4px;
}
// 边角，即两个滚动条的交汇处
*::-webkit-scrollbar-corner {
  display: none;
}
// 两个滚动条的交汇处上用于通过拖动调整元素大小的小控件
*::-webkit-resizer {
  display: none;
}

.el-breadcrumb {
  margin-left: 20px;
}

</style>
